"use client"

import { ColumnDef } from "@tanstack/react-table"
import { Lock } from "@/types/admin"
import { Button } from "@/components/ui/button"
import { ArrowUpDown, MoreHorizontal, Pencil, Trash2 } from "lucide-react"
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
import { Badge } from "@/components/ui/badge"

interface ColumnActionsProps {
  onEdit: (lock: Lock) => void
  onDelete: (lock: Lock) => void
}

const statusMap = {
  locked: { label: "已上锁", color: "bg-green-500" },
  unlocked: { label: "未上锁", color: "bg-red-500" },
  faulty: { label: "故障", color: "bg-yellow-500" },
  maintenance: { label: "维修中", color: "bg-blue-500" },
};

export const columns = ({ onEdit, onDelete }: ColumnActionsProps): ColumnDef<Lock>[] => [
  {
    accessorKey: "name",
    header: ({ column }) => (
      <Button
        variant="ghost"
        onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
      >
        名称
        <ArrowUpDown className="ml-2 h-4 w-4" />
      </Button>
    ),
  },
  {
    accessorKey: "department",
    header: "部门",
  },
  {
    accessorKey: "keyId",
    header: "钥匙ID",
  },
  {
    accessorKey: "status",
    header: "状态",
    cell: ({ row }) => {
      const status = row.getValue("status") as keyof typeof statusMap;
      const { label, color } = statusMap[status] || { label: "未知", color: "bg-gray-500" };
      return <Badge className={`${color} text-white`}>{label}</Badge>;
    },
  },
  {
    accessorKey: "lastOperationTime",
    header: "最后操作时间",
  },
  {
    id: "actions",
    cell: ({ row }) => {
      const lock = row.original;
      return (
        <DropdownMenu>
          <DropdownMenuTrigger asChild>
            <Button variant="ghost" className="h-8 w-8 p-0">
              <span className="sr-only">Open menu</span>
              <MoreHorizontal className="h-4 w-4" />
            </Button>
          </DropdownMenuTrigger>
          <DropdownMenuContent align="end">
            <DropdownMenuLabel>操作</DropdownMenuLabel>
            <DropdownMenuItem onClick={() => onEdit(lock)}>
              <Pencil className="mr-2 h-4 w-4" />
              编辑
            </DropdownMenuItem>
            <DropdownMenuItem
              className="text-red-600"
              onClick={() => onDelete(lock)}
            >
              <Trash2 className="mr-2 h-4 w-4" />
              删除
            </DropdownMenuItem>
          </DropdownMenuContent>
        </DropdownMenu>
      );
    },
  },
]; 